<template>
	<view>
		<view class="title" v-if="switchInfo.offSelect == '1'">
			当前网上报名尚未开放！
		</view>
		<view class="search">
			<u--input v-model="search.sfz" border="surround" placeholder="请输入身份证号" />
			<u--input v-model="search.xh" border="surround" placeholder="请输入学号" />
			<u-button type="primary" text="搜索" @click="searchInfo"></u-button>
		</view>
		<view class="body" v-if="!!info">
			<u-cell-group>
				<u-cell title="姓名" :value="info.tname"></u-cell>
				<u-cell title="性别" :value="info.sex"></u-cell>
				<u-cell title="身份证号" :value="info.sfz"></u-cell>
				<u-cell title="政治面貌" :value="dy(info.dy)"></u-cell>
				<u-cell title="本人电话" :value="info.tel"></u-cell>
				<u-cell title="家属电话" :value="info.phone"></u-cell>
				<u-cell title="单位" :value="info.cp"></u-cell>
				<u-cell title="第一专业">
					<view slot="value" class="classContent">
						<view class="content">
							{{info.oneEnter&&info.oneEnter.termTitle}}
						</view>
						<view class="btns">
							<u-button class="btn" :type="classType(info.oneEnter)" :text="classText(info.oneEnter)"
								@click="curriculaVariable(1,info.oneEnter)"></u-button>
							<u-button v-if="!!info.oneEnter" class="btn" type="error" text="删除"
								@click="deleted(1,info.oneEnter.classId)"></u-button>
						</view>
					</view>
				</u-cell>
				<u-cell title="第二专业">
					<view slot="value" class="classContent">
						<view class="content">
							{{info.twoEnter&&info.twoEnter.termTitle}}
						</view>
						<view class="btns">
							<u-button class="btn" :type="classType(info.twoEnter)" :text="classText(info.twoEnter)"
								@click="curriculaVariable(2,info.twoEnter)"></u-button>
							<u-button v-if="!!info.twoEnter" class="btn" type="error" text="删除"
								@click="deleted(2,info.twoEnter.classId)"></u-button>
						</view>
					</view>
				</u-cell>
				<u-cell title="第三专业">
					<view slot="value" class="classContent">
						<view class="content">
							{{info.threeEnter&&info.threeEnter.termTitle}}
						</view>
						<view class="btns">
							<u-button class="btn" :type="classType(info.threeEnter)" :text="classText(info.threeEnter)"
								@click="curriculaVariable(3,info.threeEnter)"></u-button>
							<u-button v-if="!!info.threeEnter" class="btn" type="error" text="删除"
								@click="deleted(3,info.threeEnter.classId)"></u-button>
						</view>
					</view>
				</u-cell>
				<u-cell title="第四专业">
					<view slot="value" class="classContent">
						<view class="content">
							{{info.fourEnter&&info.fourEnter.termTitle}}
						</view>
						<view class="btns">
							<u-button class="btn" :type="classType(info.fourEnter)" :text="classText(info.fourEnter)"
								@click="curriculaVariable(4,info.fourEnter)"></u-button>
							<u-button v-if="!!info.fourEnter" class="btn" type="error" text="删除"
								@click="deleted(4,info.fourEnter.classId)"></u-button>
						</view>
					</view>
				</u-cell>
				<u-cell title="第五专业">
					<view slot="value" class="classContent">
						<view class="content">
							{{info.fiveEnter&&info.fiveEnter.termTitle}}
						</view>
						<view class="btns">
							<u-button class="btn" :type="classType(info.fiveEnter)" :text="classText(info.fiveEnter)"
								@click="curriculaVariable(5,info.fiveEnter)"></u-button>
							<u-button v-if="!!info.fiveEnter" class="btn" type="error" text="删除"
								@click="deleted(5,info.fiveEnter.classId)"></u-button>
						</view>
					</view>
				</u-cell>
				<!-- <u-cell title="第六专业">
					<view slot="value">
						<u-button v-if="!info.sixEnter" type="primary" text="选课" @click="curriculaVariable(6)"></u-button>
						<view v-else>
							{{info.sixEnter}}
						</view>
					</view>
				</u-cell> -->
			</u-cell-group>
			<view class="money">
				<view class="tel">
					<view>
						优惠后共需缴费<span style="color: red;">{{info.amount}}</span>元
					</view>
				</view>
				<view class="btn">
					<u-button type="warning" @click="submit">确认提交</u-button>
				</view>
			</view>
		</view>
		<u-modal :show="showb" content='确认是否删除当前的课程' @confirm="deleted" showCancelButton @cancel="showb = false"></u-modal>
		<u-modal :show="showa" @confirm="dialogConfirm">
			<view class="slot-content">
				<iframe v-if="showa" src="../../static/xieyi/notice.html" width="100%" height="500px" frameborder="0"></iframe>
			</view>
		</u-modal>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title:'用户您好！在您注册前，请您先认真阅读本协议！',
				showa:false,
				search: {
					sfz: '',
					xh: ''
				},
				info: null,
				show: false,
				showb:false,
				classNum:'',
				switchInfo:{
					offSelect:'',
				},
			}
		},
		onLoad(e) {
			this.getSwitch()
			let a = uni.getStorageSync('dialogIfShowa')
			a = a === false ? false : true
			if(a){
				this.showa = true
			}
			if (e.xh) {
				this.search.xh = e.xh
				this.searchInfo()
			}
			if (e.sfz){
				this.search.sfz = e.sfz
				this.searchInfo()
			}
		},
		computed: {
			dy() {
				return (val) => {
					return !val ? '' :  val === '是' ? '党员' : '群众'
				}
			},
			classText(){
				return (val) =>{
					return !val ? '选课' : '修改' 
				}
			},
			classType(){
				return (val) =>{
					return !val ? 'primary' : 'warning' 
				}
			},
		},
		methods: {
			// 获取开关的配置信息
			getSwitch(){
				this.$get(this.$api.getConfigInfo,{},res=>{
					if(res.code === 200){
						this.switchInfo = res.data
						if(this.switchInfo.offSelect == '1'){
							uni.$u.toast('当前网上报名尚未开放！');
						}
					}else{
						uni.$u.toast(res.msg ? res.msg : '获取开关信息失败！');
					}
				})
			},
			// 删除课程
			deleted(val,Id){
				if(!!val){
					this.classNum = val
					this.classId = Id
					this.showb = true	
				}else{
					this.$post(this.$api.delSelectClass,{
						classId:this.classId,
						zyxh:this.classNum,
						xh:this.search.xh
					},res=>{
						if(res.code === 200){
							uni.$u.toast('删除成功！');
							this.showb = false
							this.searchInfo()
						}else{
							uni.$u.toast(res.msg ? res.msg : '操作失败！');
						}
					})
				}
			},
			dialogConfirm(){
				this.showa = false
				uni.setStorageSync('dialogIfShowa',false)
			},
			submit() {
				const {oneEnter,twoEnter,threeEnter,fourEnter,fiveEnter} = this.info
				if(!(!!oneEnter || !!twoEnter || !!threeEnter || !!fourEnter || !!fiveEnter))
					return uni.$u.toast('您需要先选择课程！');
				this.$post(this.$api.nextByStudent, {
					cost: this.info.amount,
					xh: this.info.xh
				}, res => {
					if (res.code === 200) {
						uni.$u.toast('操作成功！');
						setTimeout(res=>{
							uni.redirectTo({
								url:`/pages/index/qccode?str=${'http://wxbm.iksrv.com/#/pages/login/index?xh='+ this.info.xh}&username='${this.info.tname}'`
							})
						},1000)
					} else {
						uni.$u.toast(res.msg ? res.msg : '操作失败！');
					}
				})
			},
			searchInfo() {
				this.$post(this.$api.getInfo, this.search, res => {
					if (res.code === 200) {
						console.log(res.data);
						let info = JSON.stringify(res.data)
						let arrName = ['tname','sex','sfz','dy','phone','tel','cp']
						for(const [key,val] of Object.entries(res.data)){
							if(arrName.includes(key)&&(!val||val === '')){
								uni.$u.toast('请填写完整的个人信息！');
								setTimeout(res=>{
								uni.redirectTo({
									url:'/pages/index/studentRegistration?val=' + info
								})
								},1000)
								break
							}
						}
		 				this.info = res.data
					} else {
						uni.$u.toast(res.msg ? res.msg : '操作失败！');
					}
				})
			},
			curriculaVariable(e,onOff) {
				let num = +!!onOff
				let oldId = ''
				if(num === 1){
					oldId = onOff.classId
				}
				uni.navigateTo({
					url: `/pages/index/curriculaVariable?num=${e}&xh=${this.info.xh}&onOff=${num}&oldClassId=${oldId}`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.search {}
	.title{
		font-size: 34rpx;
		font-weight: 600;
		margin: 20rpx;
	}
	.money {
		width: 100%;

		.tel {
			width: 100%;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			height: 100rpx;
		}
	}
	.scrollable-container{
		height: 1000rpx;
		overflow: auto;
		font-size: 30rpx;
	}
	.classContent{
		width: 70%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		.content{
			color: blue;
		}
		.btns{
			display: flex;
			justify-content: space-around;
			align-items: center;
			.btn{
				width: 150rpx;
				height: 60rpx;
			}
		}
	}
</style>